<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Weather App</title>
    <link rel="stylesheet" href="./styles.css"/>
</head>
<body>
    <h1>Weather App</h1>
    <div class="parent-container" ><!-- main div -->
        <div class="inputs-container">
            <input placeholder="enter city name" class="city-name-input"/>
            <button class="srch-btn">Search weather</button>
        </div>
        <div class="outputs-container">
            <div class="city-name-output">city</div>
            <div class="temp-container">Temperature<p class="temperature"></p></div>
            <div class="text-container-parent">
                <div >Feels like<p class="feels-like"></p></div>
                <div >Humidity<p class="humidity"></p></div>
                <div>Windspeed<p class="windspeed"></p></div>
            </div>
        </div>
    </div>
    <script src="./script.js"></script>
</body>
</html>